<template>
  <div class="heart" >
    <div class="title">我们有22个重点实验室</div>
    <div class="desc">其中有3个为国家级重点实验室，19个为公司级重点实验室</div>
    <!-- <div class="swiper-container">

    </div> -->
    <LabList />
    <LabListSwiper />
  </div>
</template>

<script setup>
import LabListSwiper from './LabListSwiper.vue';
import LabList from './LabList.vue';
// import { toRefs, defineProps } from 'vue'
// const props = defineProps(['size'])
// const { size = 'lg' } = toRefs(props)
</script>

<style scoped lang="scss">
.heart{
  padding-top: dpi(13rem);
  padding-bottom: dpi(13rem);
  // max-height: dpi(243rem);
  background-color: #05204d;
  background-image: url('~@/assets/images/lab-bg.jpg');
  background-size: cover;
  .title{
    text-align: center;
    margin-bottom: dpi(4rem);
    font-family: PingFangSC-Semibold;
    font-size: dpi(4rem);
    letter-spacing: 0rem;
    color: #ffffff;
  }
  .desc{
    text-align: center;
    font-family: PingFangSC-Regular;
    font-size: dpi(2rem);
    color: #7fcfe2;
    opacity: 0.8;
  }
}
</style>